/*common css*/
*{font-family:Arial;color:#333;-webkit-appearance:none;}
body{margin:0;padding:0;background-color: #fff;}
.b{font-weight: bold;}
a{ text-decoration: none;}
.header, .footer, .content { position: absolute; left: 0; right: 0; }
.header { height: 45px; top: 0; background-color:#0161c9;color:#fff; z-index: 1; }
.header .left{font-size:15px;font-weight:normal;margin-left: 15px;color: #fff;height: 45px;line-height: 45px;margin-right: 35px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.header .right{float:right;height:45px;line-height: 45px;color: #fff;font-size:15px;position: absolute;right: 10px;top:0px;}
.header .addBtn{background:url("/mobilemode/apps/e-cology/vote/images/add_white.gif") no-repeat;background-size:13px 13px;background-position: center center;width:24px;}
.header .okBtn{background:url("/mobilemode/apps/e-cology/vote/images/check_white.gif") no-repeat;background-size:13px 13px;background-position: center center;width:24px;}
.content { padding: 0px; position: absolute; top: 45px; bottom: 0px; overflow: auto; -webkit-overflow-scrolling: touch; }
.footer { bottom: 0; background-color: #f6f6f6; z-index: 3; }
.panel.out { display: none; }

/*tab*/
div.tab{text-align:center;background-color:#0161c9;padding:11px 0 12px 0;}
div.tab ul{list-style:none;margin:0;padding:0;}
div.tab ul li{display:inline;padding:4px 20px;margin:0 -5px 0 0;font-size:12px;color:#fff;border:1px solid #017afd;border-right: 0;}
div.tab ul li:first-child{border-radius:3px 0 0 3px;}
div.tab ul li:last-child{border-radius:0 3px 3px 0;border:1px solid #017afd;}
div.tab ul li.selected{color:#fff;background-color:#017afd;}
div.tab ul li.more{position:relative;padding:4px 25px 4px 15px;}
div.tab ul li.more:after {content:"";width:15px;height:100%;position:absolute;right:10px;top:0px;background:url("/mobilemode/apps/e-cology/vote/images/arrow_down.png") no-repeat center center;background-size:8px 5px;}

/*list*/
div.listSearch{background-color:#f0f0f0;padding:6px 15px;position: relative;height: 40px;box-sizing: border-box;}
div.listSearch input{border:1px solid #e5e5e5;border-radius:50px;background-color:#fff;padding:0px 10px 0px 30px;width:100%;height:28px;box-sizing: border-box;}
div.listSearch .btn{position:absolute;top:13px;left:25px;width:14px;}
div.listContent{position: absolute;top: 40px;bottom: 0px;left: 0px;width: 100%;overflow: hidden;transition:top 0.3s;-webkit-transition: top 0.3s;background-color:#fff;z-index:2;}
ul.list{list-style:none;margin:0;padding:0 15px;overflow: hidden;}
ul.list li{border-bottom:1px solid #f4f4f4;padding:8px 0;position: relative;}
ul.list li > a{display: block;-webkit-transition: -webkit-transform 0.3s;transition: transform 0.3s;}
ul.list li img{width:40px;height:40px;border-radius: 40px;float: left;margin:1px 0 0 0;}
ul.list li div{color:#666;font-size:12px;}
ul.list li div.title{color:#0161c9;font-size:14px !important;padding:1px 0 2px 0;word-break:break-all;}
ul.list li div.flag{font-size:10px;font-weight:normal;color:#fff;background-color:#eb6100;border-radius:10px;padding:2px 8px;margin:2px 0 0 10px;float:right;}
.flag1{background-color: green !important;}
.flag2{background-color: #bcbcbc !important;}
.flag3{background-color: #0161c9 !important;}
.flag4{background-color: green !important;}
.flag5{background-color: #4572a7 !important;}
.flag6{background-color: #aa4643 !important;}
.flag7{background-color: #89a54e !important;}
.flag8{background-color: #80699b !important;}
.flag9{background-color: #92a8cd !important;}
.flag10{background-color: #db843d !important;}
ul.list li div .contactinfo{color: #999;}
ul.list li div.distance{background-color: none;position: absolute;right: 3px;bottom: 8px;color:#0161c9;}
.no_data{color:#ccc;font-size: 14px;text-align: center;padding:10px 0px;display: none;}
.load_more{color: #017afd;font-size: 14px;cursor: pointer;text-align: center;padding: .7em 1em;display: none;}

/*loading*/
.crm_loading{display: none;}
.spinner {margin: 10px auto 10px;text-align: center;}
.spinner > div {width: 10px;height: 10px;background-color: #0161c9;border-radius: 100%;display: inline-block;-webkit-animation: bouncedelay 1.4s infinite ease-in-out;animation: bouncedelay 1.4s infinite ease-in-out;-webkit-animation-fill-mode: both;animation-fill-mode: both;}
.spinner .bounce1 {-webkit-animation-delay: -0.32s;animation-delay: -0.32s;}
.spinner .bounce2 {-webkit-animation-delay: -0.16s;animation-delay: -0.16s;}
@-webkit-keyframes bouncedelay {0.1%, 80%, 100% { -webkit-transform: scale(0.0) }40% { -webkit-transform: scale(1.0) }}
@keyframes bouncedelay {0.1%, 80%, 100% {transform: scale(0.0);-webkit-transform: scale(0.0);} 40% {transform: scale(1.0);-webkit-transform: scale(1.0);}}

/*tab bar*/
.tabBar {-webkit-font-smoothing: antialiased;display: table;width: 100%;height: 40px;padding: 0;table-layout: fixed;border-top: 1px solid #ddd;border-bottom: 0;background-color: #fff;-webkit-backface-visibility: hidden;backface-visibility: hidden;box-sizing: border-box;}
.tabBar .tab-item{display: table-cell;width: 1%;height: 40px;color: #999;text-align: center;vertical-align: middle;text-decoration: none;-webkit-tap-highlight-color: transparent;box-sizing: border-box;}
.tabBar .tab-item.active, .tabBar .tab-item:active {color: #017afd;}
.tabBar .tab-item .icon {position: relative;top: 3px;display: inline-block;width: 18px;height: 18px;padding-top: 0;padding-bottom: 0;box-sizing: border-box;z-index: 20;background-repeat: no-repeat;background-size: 18px 18px; }
.tabBar .tab-item .icon ~ .tab-label {display: block;font-size: 10px;box-sizing: border-box;color: #999;}
.tabBar .tab-item.active .icon ~ .tab-label {color:#017afd}
.icon-crm{background-image: url("/mobilemode/apps/e-cology/vote/images/bar/1.gif");}
.active .icon-crm{background-image: url("/mobilemode/apps/e-cology/vote/images/bar/1b.gif");}
.icon-business{background-image: url("/mobilemode/apps/e-cology/vote/images/bar/2.gif");}
.active .icon-business{background-image: url("/mobilemode/apps/e-cology/vote/images/bar/2b.gif");}
.icon-partner{background-image: url("/mobilemode/apps/e-cology/vote/images/bar/3.gif");}
.active .icon-partner{background-image: url("/mobilemode/apps/e-cology/vote/images/bar/3b.gif");}
.icon-people{background-image: url("/mobilemode/apps/e-cology/vote/images/bar/4.gif");}
.active .icon-people{background-image: url("/mobilemode/apps/e-cology/vote/images/bar/4b.gif");}

/*form*/
form{margin: 0px;padding: 0px;}
form .field{border-bottom: 1px solid #f5f5f5;height: 40px;padding-left: 65px;position: relative;}
form .field > div:nth-child(1){color: #666;font-size: 14px;height: 100%;left: 0;line-height: 40px;overflow: hidden;padding-left: 15px;position: absolute;text-overflow: ellipsis;top: 0;white-space: nowrap;width: 50px;}
form .field > div:nth-child(2){padding-right: 15px;height:100%}
form .field.vertical{padding-left:0px !important;height:auto;}
form .field.vertical > div:nth-child(1){height: 28px;position: static;width: auto;}
form .field.vertical > div:nth-child(2){padding: 5px 15px;}
form.biger .field{padding-left: 90px;}
form.biger .field > div:nth-child(1){width: 70px;}
form.no-label .field {padding-left: 15px;}
form.no-label .field > div:nth-child(1) {display:none;}
form.no-label .field.vertical > div:nth-child(1) {display:block;}
form .field input[type="text"],form .field input[type="search"],form .field input[type="number"],form .field input[type="email"],form .field input[type="tel"]{border: 0 none;font-size: 14px;height: 40px;line-height: 20px;padding: 0;width: 100%;}
form .field a.more{display: block;background:url(/mobilemode/apps/e-cology/images/rArrow999.gif) no-repeat;background-size:6px 10px;background-position: center right;height: 100%;position: relative;}
form .field a.more div{height: 100%;line-height: 40px;font-size: 14px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
form .field .tip{position: absolute;top: 0px;left: 0px;color: #aaa;}
form .field.hasValue .tip{display: none;}
form .field .clear-btn{position: absolute;right: 0px;top: 0;width: 40px;height: 40px;background: url("/mobilemode/apps/e-cology/vote/images/lego_icon_del.png") no-repeat;background-position: center center;background-size: 13px 12px;cursor: pointer;display: none;}
form .field.hasValue .clear-btn{display: block;}
#msg{position: absolute;top: 50%;left: 15%;right: 15%;text-align: center;background-color: rgba(0,0,0,0.8);color: #fff;font-size: 14px;padding: 10px 0px;border-radius: 3px;z-index:2;display: none;transform: translateY(-50%);}
.common_msg{position: absolute;top: 40%;left: 15%;right: 15%;z-index:10;text-align: center;background-color: rgba(0,0,0,0.8);color: #fff;font-size: 14px;padding: 10px 0px;border-radius: 3px;display: none;-webkit-animation-duration: 200ms;animation-duration: 200ms;-webkit-animation-fill-mode: both; animation-fill-mode: both;}
.common_msg.show{-webkit-animation-name: fin;animation-name: fin;}
@-webkit-keyframes fin{ 0%{ opacity: 0.5; -webkit-transform: scale(0.8,0.8);} 100%{ opacity: 1; -webkit-transform: scale(1,1);} } 
@keyframes fin{ 0%{ opacity: 0.5; transform: scale(0.8,0.8);} 100%{ opacity: 1; transform:scale(1,1);} }


ul.hori_check{list-style: none;margin: 0px;padding: 0px;}
ul.hori_check li{background-color:#fff;border: 1px solid #0161c9;border-radius:30px;color:#0161c9;display: inline-block;margin: 2px 5px 3px 0px;padding:2px 10px;font-size: 12px;cursor: pointer;}
ul.hori_check li.checked{background: #0161c9;border: 1px solid #0161c9;color: #fff;}

ul.btnSelect{margin:10px 0;padding:0;list-style: none;}
ul.btnSelect li{display: inline-block;padding:3px 8px;margin:5px 5px 0 0;border:1px solid #0161c9;border-radius: 30px;color:#0161c9;font-size:12px;}
ul.btnSelect li.checked{background-color:#0161c9;color:#fff;}

.as_btn{height: 100%;width: 60px;position: absolute;top: 0px;right: 15px;z-index: 90;padding-top: 15px;padding-right: 6px;padding-left: 32px;box-sizing: border-box;cursor: pointer;}
.as_btn div{background: #aaa;}
.as_btn .line{height: 1px;width: 11px;margin-left: 2px;margin-bottom: 3px;}
.as_btn .line.one{width: 14px;}
.as_btn .line.three{width: 8px;}

div.controlTitle{background-color:#f0f0f0;color:#999;font-size:10px;line-height:22px;padding:0 15px;border-top:1px solid #e5e5e5;border-bottom:1px solid #e5e5e5;}
div.controlTitleNull{background-color:#f0f0f0;border-bottom:1px solid #e5e5e5;height:10px;}

.pop_menu{position: absolute;top: 35px;right: 0px;z-index: 91;padding-top: 5px;display: none;}
.pop_menu .arrow{position: absolute;top: 0px;right: 17px;width:0; height:0; border-left:5px solid transparent;border-right:5px solid transparent;border-bottom:5px solid #494949;}
.pop_menu ul{margin: 0px;padding: 0px;list-style: none;background-color: #494949;padding-left: 5px;border-radius: 3px;}
.pop_menu ul li{border-bottom: 1px solid #5c5961;color: #fff;background-repeat: no-repeat;background-position: 5px center;background-size: 20px 20px; }
.pop_menu ul li:last-child{border-bottom: none;}
.pop_menu ul li a{display: block;color: #fff;padding: 12px 20px 12px 30px;font-size: 14px;}
.pop_menu ul li.pos_msg a{padding: 8px 20px 8px 20px;font-size: 12px;}

/*iscroll*/
.scroll_scroller {position:absolute; z-index:1;-webkit-tap-highlight-color: rgba(0,0,0,0);width:100%;padding:0;-webkit-transform: translateZ(0);-moz-transform: translateZ(0);-ms-transform: translateZ(0);-o-transform: translateZ(0);transform: translateZ(0);-webkit-touch-callout: none;-webkit-user-select: none;-moz-user-select: none;-ms-user-select: none;user-select: none;-webkit-text-size-adjust: none;-moz-text-size-adjust: none;-ms-text-size-adjust: none;-o-text-size-adjust: none;text-size-adjust: none;}
.pullDown {background:#fff;height:40px;line-height:40px;padding:5px 0;border-bottom:1px solid #f0f0f0;font-size:12px;color:#999;text-align: center;display: none;}
.pullDown .pullDownIcon ,.listRefresh .pullDownIcon{position: relative;display: inline-block;width: 30px;height: 30px;background: url("/mobilemode/images/pull-icon@2x_wev8.png") 0 0 no-repeat;background-size: 30px 60px;-webkit-transition-property: -webkit-transform;-webkit-transition-duration: 250ms;margin-bottom: -11px;margin-right: 5px;}
.pullDown .pullDownIcon ,.listRefresh .pullDownIcon{-webkit-transform:rotate(0deg) translateZ(0);}
.pullDown.flip .pullDownIcon {-webkit-transform:rotate(-180deg) translateZ(0);margin-bottom: -9px;}
.pullDown.scroll_loading .pullDownIcon ,.listRefresh.scroll_loading .pullDownIcon{background-color: transparent;width: 13px;height: 13px;border-radius: 100%;margin: 0px 10px 0px 0px;-webkit-animation-fill-mode: both;animation-fill-mode: both;border: 2px solid #c5c5c5;border-bottom-color: transparent;background: transparent !important;display: inline-block;-webkit-animation: rotate 0.75s 0s linear infinite;animation: rotate 0.75s 0s linear infinite;top: 3px; }
.pullDown .pullDownLabel, .listRefresh .pullDownLabel{color:#999;font-size: 14px;}
@-webkit-keyframes rotate {0% {-webkit-transform: rotate(0deg);transform: rotate(0deg); }50% {-webkit-transform: rotate(180deg);transform: rotate(180deg); }100% {-webkit-transform: rotate(360deg);transform: rotate(360deg); } }
@keyframes rotate {0% {-webkit-transform: rotate(0deg);transform: rotate(0deg); }50% {-webkit-transform: rotate(180deg);transform: rotate(180deg); }100% {-webkit-transform: rotate(360deg);transform: rotate(360deg); } }
.iScrollVerticalScrollbar {position: absolute;z-index: 9999;width: 3px;bottom: 2px;top: -15px;right: 3px;overflow: hidden;}
.iScrollVerticalScrollbar.iScrollBothScrollbars {bottom: 18px;}
.iScrollIndicator {width: 100%;position: absolute;background: rgba(0,0,0,0.35);border-radius: 3px;}

.content.list_refreshing div.listContent{top : 90px;}
.content.list_refreshing .pullDown{visibility: hidden;}
div.listRefresh{position: absolute;top:40px;left:0px;width: 100%;height:50px;overflow: hidden;text-align: center;line-height: 50px;z-index:1;-webkit-animation-duration: 300ms;animation-duration: 300ms;-webkit-animation-fill-mode: both; animation-fill-mode: both; -webkit-animation-name: ffout;animation-name: ffout;}
.content.list_refreshing div.listRefresh{-webkit-animation-name: ffin;animation-name: ffin;}
@-webkit-keyframes ffin{ 0%{ opacity: 0.3; -webkit-transform: scale(0.3,0.3);} 100%{ opacity: 1; -webkit-transform: scale(1,1);} } 
@keyframes ffin{ 0%{ opacity: 0.3; transform: scale(0.3,0.3);} 100%{ opacity: 1; transform:scale(1,1);} }
@-webkit-keyframes ffout{ 0%{ opacity: 1; -webkit-transform: scale(1,1);} 100%{ opacity: 0.3; -webkit-transform: scale(0.3,0.3);}} 
@keyframes ffout{ 0%{opacity: 1; transform:scale(1,1);}100%{opacity: 0.3; transform: scale(0.3,0.3);}}

.slideup-out {
	-webkit-transform: translateY(0);
	-webkit-animation-name: slideouttobottom;
	-webkit-animation-duration: 250ms;
	transform: translateY(0);
	animation-name: slideouttobottom;
	animation-duration: 250ms;
}
.slideup-in {
	-webkit-transform: translateY(0);
	-webkit-animation-name: slideinfrombottom;
	-webkit-animation-duration: 250ms;
	transform: translateY(0);
	animation-name: slideinfrombottom;
	animation-duration: 250ms;
}
@-webkit-keyframes slideinfrombottom {
    from { -webkit-transform: translateY(100%); }
    to { -webkit-transform: translateY(0); }
}
@keyframes slideinfrombottom {
    from { transform: translateY(100%); }
    to { transform: translateY(0); }
}
@-webkit-keyframes slideouttobottom {
    from { -webkit-transform: translateY(0); }
    to { -webkit-transform: translateY(100%); }
}
@keyframes slideouttobottom {
    from { transform: translateY(0); }
    to { transform: translateY(100%); }
}